<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>music-rodio</title>
    <style>
        #{margin: 0;padding: 0;} 

        ul {
            list-style-type: none;
        }

        .top-b-out {
            width: 1560px;
            height: 70px;
            top: 0px;
            background-color: rgb(36, 36, 36);
        }

        .top-b {
            width: 1100px;
            height: 70px;
            top: 0px;
            background-color: rgb(36, 36, 36);
            display: flex;
            color: rgb(204, 204, 204);
            text-align: center;
            margin: auto;
        }

        .t1 {
            width: 190px;
            height: 75px;
            line-height: 22px;
            font-size: 21px;
            font-family: Arial, Helvetica, sans-serif;
            color: rgb(231, 255, 255);
        }

        .pos1 {
            width: 170px;
            height: 50px;
            position: relative;
            top: 12px;
        }

        #top-b-word {
            color: rgb(204, 204, 204);
            width: 80px;
            height: 70px;
            line-height: 75px;
            font-size: 14px;
            margin-top: 0;
        }

        .light1 {
            background-color: #000000;
            color: rgb(231, 255, 255);
        }

        .pos2 {
            position: relative;
            top: 10px;
            left: -4px;
            width: 33px;
            height: 35px;
        }

        .pos3 {
            width: 300px;
            height: 50px;
            position: relative;
            top: 11px;
            right: -110px;
        }

        .top-r-out {
            width: 1560px;
            height: 40px;
            top: 0px;
            background-color: rgb(194, 12, 12);
        }

        .top-r {
            width: 800px;
            height: 40px;
            top: 0px;
            background-color: rgb(194, 14, 14);
            display: flex;
            color: rgb(231, 255, 255);
            text-align: center;
            margin: auto;
        }

        #top-r-word {
            width: 100px;
            height: 40px;
            color: rgb(231, 255, 255);
            line-height: 40px;
            font-size: 14px;
            margin-top: 0;
        }

        .light2{
            background-color: rgb(230, 0, 28);
        }

        a {
            color: rgb(153, 153, 153);
            text-decoration: none;
            display: block;
        }

        #black {
            color: black;
        }

        #black:hover{
            text-decoration: underline;
        }

        .background {
            position: relative;
            top: 50px;
            width: 1560px;
            height: 3300px;
            background-color: rgb(245, 245, 245);

        }

        .all {
            background-color: rgb(255, 255, 255);
            position: relative;
            width: 1100px;
            height: 3250px;
            border-left: 2px solid rgb(211, 211, 211);
            border-right: 2px solid rgb(211, 211, 211);
            top: 0px;
            margin: auto;
        }

        .top-line {
            position: relative;
            margin-top: -50px;

        }

        .line {
            width: 1000px;
            height: 150px;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            margin: auto;

        }

        .line-pw {
            font-size: 10px;
            color: gray;
            width: 80px;
            height: 80px;
            text-align: center;
            padding: 11px;
            background-color: rgb(255, 255, 255);
        }

        .line-pw:hover{
            background-color: rgb(246, 247, 247);
        }

        .wt1 {
            margin-top: -7px;
        }

        .control {
            text-align: center;
            width: 30px;
            height: 190px;
            line-height: 190px;
            color: rgb(236, 236, 236);
            background-color: rgb(255, 255, 255);
        }

        .con-left {
            position: absolute;
            left: 20px;
            top: 43px;
            font-size: 30px;
        }

        .con-right {
            position: absolute;
            right: 20px;
            top: 49px;
            font-size: 30px;
        }

        .dot {
            width: 1000px;
            position: absolute;
            top: 235px;
            left: 390px;
        }

        .left-title {
            width: 120px;
            height: 50px;
            line-height: 15px;
            font-size: 25px;
        }

        .left-more {
            font-size: 10px;
            color: rgb(102, 102, 102);
            width: 50px;
            height: 50px;
            line-height: 50px;
            position: relative;
            right: -275px;
        }

        .line {
            width: 1000px;
            position: relative;
            padding-top: 50px;
            padding-bottom: 20px;
            margin: auto;
            display: flex;
        }

        .line-left,
        .line-right {
            width: 426px;
            position: relative;
            padding-left: 25px;
            padding-right: 25px;
        }

        .line-left-top {
            height: 50px;
            border-bottom: 2px solid red;
            display: flex;
        }

        .line-left-items {
            position: relative;
            width: 426px;
            height: 600px;
            display: inline-block;
            top: -15px;
            left: -50px;
        }

        .line-left-item {
            width: 426px;
            height: 60px;
            display: flex;
        }

        .line-left-item:hover{
            background-color: rgb(238, 238, 238);
        }

        .line-img {
            position: relative;
            width: 40px;
            height: 40px;
            top: 5px;
            left: 12px;
        }

        .line-left-item-word {
            font-size: 8px;
            position: relative;
            width: 280px;
            height: 40px;
            line-height: 25px;
            margin-left: 20px;
        }

        .change {
            color: rgb(151, 151, 151);
        }

        .back {
            position: relative;
            width: 437px;
            height: 60px;
            background-color: rgb(247, 247, 247);
        }

        .line-left-item-p {
            position: relative;
            text-align: center;
            width: 60px;
            height: 18px;
            font-size: 2px;
            color: rgb(151, 151, 151);
            border: 1px solid rgb(204, 204, 204);
            top: 16px;
            left: 20px;
        }

        .right-title {
            width: 130px;
            height: 25px;
            line-height: 15px;
            font-size: 25px;
        }

        .right-more {
            font-size: 10px;
            color: rgb(102, 102, 102);
            width: 50px;
            height: 50px;
            line-height: 50px;
            position: relative;
            right: -260px;
        }

        .line-right-top {
            height: 50px;
            border-bottom: 2px solid red;
            display: flex;
        }  

        .line-right-items {
            position: relative;
            width: 426px;
            height: 600px;
            display: inline-block;
            top: -15px;
            left: -50px;
        }

        .line-right-item {
            width: 426px;
            height: 60px;
            display: flex;
        }

        .line-right-item:hover{
            background-color: rgb(238, 238, 238);
        }

        .line-right-item-word {
            font-size: 8px;
            position: relative;
            width: 280px;
            height: 40px;
            line-height: 25px;
            margin-left: 20px;
        }

        .line-right-item-p {
            position: relative;
            top: 16px;
            left: 10px;
            text-align: center;
            width: 60px;
            height: 20px;
            font-size: 2px;
            color: rgb(151, 151, 151);
            border: 1px solid rgb(204, 204, 204);
        }

        .change{
            font-size: 8px;
            color: rgb(151, 151, 151);
        }

        .recom,
        .life,
        .emo,
        .inn,
        .kown {
            width: 950px;
            position: relative;
            top: 550px;
            padding-left: 20px;
            padding-right: 25px;
            margin: auto;
        }

        .up {
            height: 50px;
            border-bottom: 2px solid rgb(194, 12, 12);
            display: flex;
        }

        .title {
            width: 180px;
            height: 25px;
            line-height: 15px;
            font-size: 25px;
        }

        .title:hover{
            text-decoration: underline;
        }

        .more {
            font-size: 10px;
            color: rgb(102, 102, 102);
            width: 50px;
            height: 50px;
            line-height: 50px;
            position: relative;
            left: 740px;
        }

        .left,
        .right {
            width: 472px;
            position: relative;
            left: -40px;
            display: inline-block;
        }

        .img {
            width: 120px;
            height: 120px;
        }

        .items {
            width: 435px;
            display: inline-block;
        }

        .item {
            width: 410px;
            height: 170px;
            display: flex;
            border-bottom: 1px solid rgb(231, 231, 231);
        }

        .down {
            border-bottom: none;
        }

        .item-word {
            font-size: 20px;
            position: relative;
            width: 280px;
            height: 40px;
            line-height: 40px;
            margin-top: 0px;
            margin-left: 20px;
        }

        .ddown {
            position: relative;
            width: 1560px;
            height: 350px;
            background-color: rgb(242, 242, 242);
            border-top: 2px solid rgb(245, 245, 245);
        }

        .dd-p {
            position: relative;
            top: 60px;
            width: 900px;
            height: 10px;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            margin: auto;
        }

        .dd-pp{
            font-size: 10px;
            color: rgb(121, 121, 121);
            width: 90px;
            height: 90px;
            text-align: center;
            padding: 10px;
        }

        .dd-word {
            color: rgb(102, 102, 102);
            width: 1000px;
            position: relative;
            padding-top: 200px;
            font-size: 10px;
            line-height: 10px;
            text-align: center;
            margin: auto;
        }

        .dd-fen {
            display: inline-flex;
        }

        .upup {
            position: absolute;
            width: 50px;
            height: 50px;
            line-height: 50px;
            text-align: center;
            top: 3300px;
            left: 1400px;
            color: rgb(204, 204, 204);
            background-color: rgb(244, 244, 244);
            border: 1px solid rgb(221, 221, 221);
        }

        .upup:hover{
            background-color: rgb(238, 238, 238);
        }
    </style>
</head>

<body>
    <div class="top">
        <div class="top-b-out">
            <div class="top-b">
                <img class="pos1" src="./tupian/wang.png" alt="" height="50px">
                <a id="top-b-word" class="light1" href="https://music.163.com/#">发现音乐</a>
                <a id="top-b-word" href="https://music.163.com/#/my/m/music/playlist?id=2983717462">我的音乐</a>
                <a id="top-b-word" href="https://music.163.com/#/friend">关注</a>
                <a id="top-b-word" href="http://which-pot.gitee.io/zhangzhang/1supermarket.html" target="_blank">商城</a>
                <a id="top-b-word" href="https://music.163.com/st/musician" target="_blank">音乐人</a>
                <a id="top-b-word" href="https://music.163.com/#/download">下载客户端</a>
                <img class="pos2" src="./tupian/hot.png" alt="">
                <img class="pos3" src="./tupian/外面.png" alt="">
            </div>
        </div>
        <div class="top-r-out">
            <div class="top-r">
                <a id="top-r-word" href="http://which-pot.gitee.io/yang-boxs/twork1.html">推荐</a>
                <a id="top-r-word" href="https://music.163.com/#/discover/toplist">排行榜</a>
                <a id="top-r-word" href="https://music.163.com/#/discover/playlist">歌单</a>
                <a id="top-r-word"  class="light2" href="https://which-pot.gitee.io/netease-cloud---radio/music.html">主播电台</a>
                <a id="top-r-word" href="https://music.163.com/#/discover/artist">歌手</a>
                <a id="top-r-word" href="https://music.163.com/#/discover/album">新碟上架</a>
            </div>
        </div>
    </div>

    <div class="background">
        <div class="all">
            <div class="top-line">
                <div class="line">
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/1.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=3">情感</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/2.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=2">音乐推荐</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/3.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=10001">有声书</a>
                    </div>
                    <div class="line-pw wt1">
                        <img src="./tupian/小图标 前排/4.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=8">脱口秀</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/5.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=2001 ">创作翻唱</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/6.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=10002">电音</a>
                    </div>
                    <div class="line-pw wt2">
                        <img src="./tupian/小图标 前排/7.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=11">知识</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/8.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=3001">二次元</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/9.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=14">明星专区</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/10.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=6">生活</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/11.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=13">亲子</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/12.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=3087096">新闻资讯</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/13.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=3088097">广播剧</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/14.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=3080097">故事</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/15.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=3080098">人文历史</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/16.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=3083097">娱乐</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/17.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=3088098">相声曲艺</a>
                    </div>
                    <div class="line-pw">
                        <img src="./tupian/小图标 前排/18.png" alt="">
                        <a href="https://music.163.com/#/discover/djradio/category?id=3081098">其他</a>
                    </div>

                </div>
                <div>
                    <div class="control con-left">
                        < </div>
                            <div class="control con-right"> > </div>
                    </div>
                    <div class="dot">
                        <img src="./tupian/点.png" alt="">
                    </div>
                </div>


                <div class="line">
                    <div class="line-left">
                        <div class="line-left-top">
                            <p class=" left-title">推荐节目</p>
                            <p class="left-more"> 更多></p>
                        </div>
                        <ul class="line-left-items ">
                            <li class="line-left-item">
                                <img class="line-img" src="./tupian/第一列/1.png" alt="">
                                <div class="line-left-item-word">
                                    <a id="black"
                                        href="https://music.163.com/#/program?id=2518695180">石璐退出刺猬乐队：一代人的青春终将老去</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=792853376">音乐下午茶</a>
                                </div>
                                <div class="line-left-item-p ">
                                    <a href="https://music.163.com/#/discover/djradio/category?id=2">音乐推荐</a>
                                </div>
                            </li>
                            <li class="line-left-item back">
                                <img class="line-img" src="./tupian/第一列/2.png" alt="">
                                <div class="line-left-item-word">
                                    <a id="black"
                                        href="https://music.163.com/#/program?id=2518654299">vol.50当三八妇女节碰上金陵十二钗，红楼梦...</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=792381378">旺角淘词城</a>
                                </div>
                                <div class="line-left-item-p ">
                                    <a href="https://music.163.com/#/discover/djradio/category?id=2">音乐推荐</a>
                                </div>
                            </li>
                            <li class="line-left-item ">
                                <img class="line-img" src="./tupian/第一列/3.png" alt="">
                                <div class="line-left-item-word">
                                    <a id="black" href="https://music.163.com/#/program?id=2518509233">罗大佑 万晓利 周云蓬
                                        好妹妹的光阴故事</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=261020">思生活</a>
                                </div>
                                <div class="line-left-item-p ">
                                    <a href="https://music.163.com/#/discover/djradio/category?id=2">音乐推荐</a>
                                </div>
                            </li>
                            <li class="line-left-item back">
                                <img class="line-img" src="./tupian/第一列/4.png" alt="">
                                <div class="line-left-item-word">
                                    <a id="black" href="https://music.163.com/#/program?id=2518590964">求助
                                        小女孩的世界竟然这么复杂</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=526671652">家有潮妈</a>
                                </div>
                                <div class="line-left-item-p ">
                                    <a href="https://music.163.com/#/discover/djradio/category?id=13">亲子</a>
                                </div>
                            </li>
                            <li class="line-left-item">
                                <img class="line-img" src="./tupian/第一列/5.png" alt="">
                                <div class="line-left-item-word">
                                    <a id="black"
                                        href="https://music.163.com/#/program?id=2518687943">302.Lunmi刘敏×张悦然：是谁在抑制女性创作</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=526582590">看理想圆桌</a>
                                </div>
                                <div class="line-left-item-p ">
                                    <a href="https://music.163.com/#/discover/djradio/category?id=8">脱口秀</a>
                                </div>
                            </li>
                            <li class="line-left-item back">
                                <img class="line-img" src="./tupian/第一列/6.png" alt="">
                                <div class="line-left-item-word">
                                    <a id="black" href="https://music.163.com/#/program?id=2518659075">人间三月，民谣在春天吟唱</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=341291088">音乐咖啡馆</a>
                                </div>
                                <div class="line-left-item-p ">
                                    <a href="https://music.163.com/#/discover/djradio/category?id=2">音乐推荐</a>
                                </div>
                            </li>
                            <li class="line-left-item ">
                                <img class="line-img" src="./tupian/第一列/7.png" alt="">
                                <div class="line-left-item-word">
                                    <a id="black"
                                        href="https://music.163.com/#/program?id=2518644881">当演员们唱起歌，一个眼神就可以让歌词流泪</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=982881971">音乐地下铁</a>
                                </div>
                                <div class="line-left-item-p ">
                                    <a href="https://music.163.com/#/discover/djradio/category?id=2">音乐推荐</a>
                                </div>
                            </li>
                            <li class="line-left-item back">
                                <img class="line-img" src="./tupian/第一列/8.png" alt="">
                                <div class="line-left-item-word">
                                    <a id="black"
                                        href="https://music.163.com/#/program?id=2518610182">38节：“她”是妈妈是女儿，是惊艳了时光的半...</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=794538648">这里有一首歌</a>
                                </div>
                                <div class="line-left-item-p ">
                                    <a href="https://music.163.com/#/discover/djradio/category?id=2">音乐推荐</a>
                                </div>
                            </li>
                            <li class="line-left-item ">
                                <img class="line-img" src="./tupian/第一列/9.png" alt="">
                                <div class="line-left-item-word">
                                    <a id="black" href="https://music.163.com/#/program?id=2518349057">她说|别担心，你只管向前</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=465059">半岛玫瑰</a>
                                </div>
                                <div class="line-left-item-p ">
                                    <a href="https://music.163.com/#/discover/djradio/category?id=3">情感</a>
                                </div>
                            </li>
                            <li class="line-left-item back">
                                <img class="line-img" src="./tupian/第一列/10.png" alt="">
                                <div class="line-left-item-word">
                                    <a id="black" href="https://music.163.com/#/program?id=2518550000">惊蛰：向低处，雷声里的顿悟</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=347343065">你好，中文系</a>
                                </div>
                                <div class="line-left-item-p ">
                                    <a href="https://music.163.com/#/discover/djradio/category?id=3080098">人文历史</a>
                                </div>
                            </li>



                        </ul>


                    </div>
                    <div class="line-right">
                        <div class="line-right-top">
                            <p class="right-title">节目排行榜</p>
                            <p class="right-more"> 更多></p>
                        </div>
                        <ul class="line-right-items">
                            <li class="line-right-item">
                                <img class="line-img" src="./tupian/第二列/1.png" alt="">
                                <div class="line-right-item-word">
                                    <a id="black" href="https://music.163.com/#/program?id=2514340475">如果爱忘了【0.9x】</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=976369856">Zhxx7x.</a>
                                </div>
                                <div class="line-right-item-p ">
                                    <p>100%</p>
                                </div>
                            </li>
                            <li class="line-right-item back">
                                <img class="line-img" src="./tupian/第二列/2.png" alt="">
                                <div class="line-right-item-word">
                                    <a id="black" href="https://music.163.com/#/program?id=2515177001">你瞒我瞒（烟嗓版）</a>
                                    <a class="change"
                                        href="https://music.163.com/#/djradio?id=975637506">2023抖音热歌BGM</a>
                                </div>
                                <div class="line-right-item-p ">
                                    <p>85%</p>
                                </div>
                            </li>
                            <li class="line-right-item ">
                                <img class="line-img" src="./tupian/第二列/3.png" alt="">
                                <div class="line-right-item-word">
                                    <a id="black" href="https://music.163.com/#/program?id=2518266591">苦咖啡、DJ版</a>
                                    <a class="change"
                                        href="https://music.163.com/#/djradio?id=791796363">2023年抖音热歌~（持续更新）</a>
                                </div>
                                <div class="line-right-item-p ">
                                    <p>60%</p>
                                </div>
                            </li>
                            <li class="line-right-item back">
                                <img class="line-img" src="./tupian/第二列/4.png" alt="">
                                <div class="line-right-item-word">
                                    <a id="black" href="https://music.163.com/#/program?id=2518818541">温啾啾私人订制</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=793942484">XyDJ铁柱</a>
                                </div>
                                <div class="line-right-item-p ">
                                    <p>57%</p>
                                </div>
                            </li>
                            <li class="line-right-item">
                                <img class="line-img" src="./tupian/第二列/5.png" alt="">
                                <div class="line-right-item-word">
                                    <a id="black"
                                        href="https://music.163.com/#/program?id=2511274326">多远都要在一起（0.8x降调版）</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=980096427">释怀吧</a>
                                </div>
                                <div class="line-right-item-p ">
                                    <p>55%</p>
                                </div>
                            </li>
                            <li class="line-right-item back">
                                <img class="line-img" src="./tupian/第二列/6.png" alt="">
                                <div class="line-right-item-word">
                                    <a id="black" href="https://music.163.com/#/program?id=2518032292">旺仔私货中文2023
                                        vol.20</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=527040594">舞动青春，DJ阿星</a>
                                </div>
                                <div class="line-right-item-p ">
                                    <p>52%</p>
                                </div>
                            </li>
                            <li class="line-right-item">
                                <img class="line-img" src="./tupian/第二列/7.png" alt="">
                                <div class="line-right-item-word">
                                    <a id="black"
                                        href="https://music.163.com/#/program?id=2517889488">Vol。097|罗翔：真正的爱情是什么</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=982264449">罗翔老师讲人生</a>
                                </div>
                                <div class="line-right-item-p ">
                                    <p>50%</p>
                                </div>
                            </li>
                            <li class="line-right-item back">
                                <img class="line-img" src="./tupian/第二列/8.png" alt="">
                                <div class="line-right-item-word">
                                    <a id="black" href="https://music.163.com/#/program?id=2511931455">I get smoke</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=981569774">I get
                                        smoke</a>
                                </div>
                                <div class="line-right-item-p ">
                                    </p>48%</p>
                                </div>
                            </li>
                            <li class="line-right-item">
                                <img class="line-img" src="./tupian/第二列/9.png" alt="">
                                <div class="line-right-item-word">
                                    <a id="black" href="https://music.163.com/#/program?id=2516941905">Scopin（抖音热门版）</a>
                                    <a class="change"
                                        href="https://music.163.com/#/djradio?id=793647428">2023抖音热歌热门~BGM</a>
                                </div>
                                <div class="line-right-item-p ">
                                    <p>42%</p>
                                </div>
                            </li>
                            <li class="line-right-item back">
                                <img class="line-img" src="./tupian/第二列/10.png" alt="">
                                <div class="line-right-item-word">
                                    <a id="black" href="https://music.163.com/#/program?id=2516781482">越来越不懂爱</a>
                                    <a class="change" href="https://music.163.com/#/djradio?id=977706417">[耳机|高质量]自调</a>
                                </div>
                                <div class="line-right-item-p ">
                                    <p>38%</p>
                                </div>
                            </li>
                        </ul>

                    </div>
                </div>

                <div class="dt">
                    <div class="recom">
                        <div class="up">
                            <p class="title">音乐推荐 电台</p>
                            <p class="more">更多></p>
                        </div>
                        <div class="left">
                            <div class="items">
                                <ul class="item">
                                    <img class="img" src="./tupian/音乐推荐/1.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/#/djradio?id=968369307"><strong>热甜酒</strong></a>
                                        <p class="change">王欣宇&张钰独家音乐博客</p>
                                    </li>
                                </ul>
                                <ul class="item down">
                                    <img class="img" src="./tupian/音乐推荐/2.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/#/djradio?id=973766334"><strong>复古电台</strong></a>
                                        <p class="change">用音乐一起造梦</p>
                                    </li>
                                </ul>
                            </div>
                        </div>

                        <div class="right">
                            <div class="items">
                                <ul class="item">
                                    <img class="img" src="./tupian/音乐推荐/3.png" alt="">
                                    <li class="item-word">
                                        <a id="black" href="https://music.163.com/#/djradio?id=794491475"><strong>Wigwam
                                                Playlist</strong></a>
                                        <p class="change">The Oppposite of Loneliness</p>
                                    </li>
                                </ul>
                                <ul class="item down">
                                    <img class="img" src="./tupian/音乐推荐/4.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/#/djradio?id=977552564"><strong>不摇滚电台</strong></a>
                                        <p class="change">听见音乐，走过山河</p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>

                    <div class="life">
                        <div class="up">
                            <p class="title">生活 电台</p>
                            <p class="more">更多></p>
                        </div>
                        <div class="left">
                            <div class="items">
                                <ul class="item">
                                    <img class="img" src="./tupian/生活/1.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/#/djradio?id=980333710"><strong>沉浸式流金电台|治愈时刻</strong></a>
                                        <p class="change">沉浸式氛围空间</p>
                                    </li>
                                </ul>
                                <ul class="item down">
                                    <img class="img" src="./tupian/生活/2.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/#/djradio?id=965843227"><strong>童话冥想：御姐音|一听就困
                                                不再失眠</strong></a>
                                        <p class="change">御姐音治愈你的失眠</p>
                                    </li>
                                </ul>
                            </div>
                        </div>

                        <div class="right">
                            <div class="items">
                                <ul class="item">
                                    <img class="img" src="./tupian/生活/3.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=980145801"><strong>晚安电台|氛围音乐
                                                白噪音</strong></a>
                                        <p class="change">深夜白噪音歌单</p>
                                    </li>
                                </ul>
                                <ul class="item down">
                                    <img class="img" src="./tupian/生活/4.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=966559685"><strong>助眠氛围轻音推荐</strong></a>
                                        <p class="change">氛围轻音&助眠&学习&解压</p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>

                    <div class="emo">
                        <div class="up">
                            <p class="title">情感 电台</p>
                            <p class="more">更多></p>
                        </div>
                        <div class="left">
                            <div class="items">
                                <ul class="item">
                                    <img class="img" src="./tupian/情感/1.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=970764541"><strong>【正太音】经典人生故事</strong></a>
                                        <p class="change">听正太音讲人生故事</p>
                                    </li>
                                </ul>
                                <ul class="item down">
                                    <img class="img" src="./tupian/情感/2.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=975069"><strong>平凡的时间里</strong></a>
                                        <p class="change">记录细碎过往和微小爱意</p>
                                    </li>
                                </ul>
                            </div>
                        </div>

                        <div class="right">
                            <div class="items">
                                <ul class="item">
                                    <img class="img" src="./tupian/情感/3.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=968247268"><strong>失眠城市——陪你一起等天明</strong></a>
                                        <p class="change">用温暖的声音治愈你</p>
                                    </li>
                                </ul>
                                <ul class="item down">
                                    <img class="img" src="./tupian/情感/4.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=959832904"><strong>人间太匆匆</strong></a>
                                        <p class="change">所有的感情都来自于偏爱</p>
                                    </li>
                                </ul>
                            </div>
                        </div>

                    </div>

                    <div class="inn">
                        <div class="up">
                            <p class="title">创作翻唱 电台</p>
                            <p class="more">更多></p>
                        </div>
                        <div class="left">
                            <div class="items">
                                <ul class="item">
                                    <img class="img" src="./tupian/创作翻唱/1.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=527394590"><strong>爱抽烟屁的彦祖</strong></a>
                                        <p class="change">让小哥哥的迷人低音炮治愈你</p>
                                    </li>
                                </ul>
                                <ul class="item down">
                                    <img class="img" src="./tupian/创作翻唱/2.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=793242384"><strong>王巨星的电台</strong></a>
                                        <p class="change">你一定会爱上的惊艳男生翻唱</p>
                                    </li>
                                </ul>
                            </div>
                        </div>

                        <div class="right">
                            <div class="items">
                                <ul class="item">
                                    <img class="img" src="./tupian/创作翻唱/3.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=792728674"><strong>颜人中的隔壁小窝</strong></a>
                                        <p class="change">住在你家隔壁，吵闹的歌唱男孩</p>
                                    </li>
                                </ul>
                                <ul class="item down">
                                    <img class="img" src="./tupian/创作翻唱/4.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=527670628"><strong>网瘾少女叽</strong></a>
                                        <p class="change">元气少女唱好听的歌送给你</p>
                                    </li>
                                </ul>
                            </div>
                        </div>

                    </div>

                    <div class="kown">
                        <div class="up">
                            <p class="title">知识 电台</p>
                            <p class="more">更多></p>
                        </div>
                        <div class="left">
                            <div class="items">
                                <ul class="item">
                                    <img class="img" src="./tupian/知识/1.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=961021012"><strong>星辰计划</strong></a>
                                        <p class="change">仰望星空，探索未知世界</p>
                                    </li>
                                </ul>
                                <ul class="item down">
                                    <img class="img" src="./tupian/知识/2.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=960561793"><strong>15赫兹|听见打工人的声音</strong></a>
                                        <p class="change">专注于倾听职场人的声音</p>
                                    </li>
                                </ul>
                            </div>
                        </div>

                        <div class="right">
                            <div class="items">
                                <ul class="item">
                                    <img class="img" src="./tupian/知识/3.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=959840052"><strong>组织进化论</strong></a>
                                        <p class="change">“飞书”×生动活泼，每期访谈一位优秀管理者</p>
                                    </li>
                                </ul>
                                <ul class="item down">
                                    <img class="img" src="./tupian/知识/4.png" alt="">
                                    <li class="item-word">
                                        <a id="black"
                                            href="https://music.163.com/djradio?id=960535954"><strong>助眠先生的活力学</strong></a>
                                        <p class="change">心理学家蔡宇哲的睡眠知识分享</p>
                                    </li>
                                </ul>
                            </div>
                        </div>

                    </div>
                </div>
            </div>


        </div>

        <div class="ddown">
            <div class="dd-p">
                <div class="dd-pp">
                    <img  src="./tupian/小图标 尾端/1.png" alt="">
                    <p>音乐开放平台</p>
                    
                </div>
                <div class="dd-pp">
                    <img src="./tupian/小图标 尾端/2.png" alt="">
                    <p>运存交易所</p>
                </div>
                <div class="dd-pp">
                    <img src="./tupian/小图标 尾端/3.png" alt="">
                    <p>Amped Studio</p>
                </div>
                <div class="dd-pp">
                    <img src="./tupian/小图标 尾端/4.png" alt="">
                    <p>用户认证</p>
                </div>
                <div class="dd-pp">
                    <img src="./tupian/小图标 尾端/5.png" alt="">
                    <p>音乐交易平台</p>
                </div>
                <div class="dd-pp">
                    <img src="./tupian/小图标 尾端/6.png" alt="">
                    <p>赞赏</p>
                </div>
                <div class="dd-pp">
                    <img src="./tupian/小图标 尾端/7.png" alt="">
                    <p>视频激励</p>
                </div>
            </div>

            <div class="dd-word">
                <p>服务条款| 隐私政策| 儿童隐私政策| 版权投诉| 投资者关系| 广告合作 | 联系我们</p>
                <p>廉正举报 不良信息举报邮箱: 51jubao@service.netease.com 客服热线：95163298</p>
                <p>互联网宗教信息服务许可证：浙（2022）0000120 增值电信业务经营许可证：浙B2-20150198 粤B2-20090191-18 工业和信息化部备案管理系统网站</p>
                <div class="dd-fen">
                    <p>网易公司版权所有©1997-2023杭州乐读科技有限公司运营：浙网文[2021] 1186-054号 </p>
                    <img src="./tupian/公安.png" alt="" width="15px" height="15px">
                    <p> 浙公网安备 33010902002564号</p>
                </div>



            </div>

        </div>

        <div class="upup">
            <a href="#">top</a>
        </div>




</body>

</html>